<template>
  <div class="rightbox" v-cloak>
    <h1>案例审核</h1>
    <el-row style="width: 96%;margin:2% 2% 10px 2%;">
      <div :span="3" style="float:left">
        <el-select v-model="state" placeholder="状态">
          <el-option label="全部" value="99"></el-option>
          <el-option label="待审核" value="0"></el-option>
          <el-option label="已通过" value="1"></el-option>
          <el-option label="未通过" value="-1"></el-option>
        </el-select>
      </div>
      <div style="margin-left:10px;float:left">
        <el-select v-model="companyindex" placeholder="选择公司">
          <el-option v-for="(item, index) in companyList" :key="index" :label="item.name" :value="item.companyindex"></el-option>
        </el-select>
      </div>
      <div style="margin-left:10px;float:left">
        <el-select v-model="designerindex" placeholder="选择设计师">
          <el-option v-for="(item, index) in desigList" :key="index" :label="item.name" :value="item.designerindex"></el-option>
        </el-select>
      </div>
      <div style="margin-left:10px;width:120px;float:left">
        <el-input v-model="title" placeholder="方案标题"></el-input>
      </div>
      <div style="margin-left:20px;float:left">
        <el-button type="primary" @click="Search">查询</el-button>
      </div>
    </el-row>
    <el-table
      :data="contentList"
      border
      style="width: 96%;margin: 5px 2%">
      <el-table-column
        prop="companyName"
        label="所属公司">
      </el-table-column>
      <el-table-column
        prop="title"
        label="方案标题">
      </el-table-column>
      <el-table-column
        prop="designerName"
        label="设计师">
      </el-table-column>
      <el-table-column
        prop="doorparam"
        label="户型">
      </el-table-column>
      <el-table-column
        prop="fixareaparam"
        label="面积">
      </el-table-column>
      <el-table-column
        prop="fixmoneyparam"
        label="预算">
      </el-table-column>
      <el-table-column
        prop="fixmoneyparam"
        width="200px"
        label="封面图">
        <template slot-scope="scope">
          <img style="width:200px;" :src="scope.row.thumbnail">
        </template>
      </el-table-column>
      <el-table-column
        prop=""
        label="状态">
        <template slot-scope="scope">
          <span v-if="scope.row.state == 0">待审核</span>
          <span v-if="scope.row.state == 1">已通过</span>
          <span v-if="scope.row.state == -1">未通过({{scope.row.remarks}})</span>
        </template>
      </el-table-column>
      <el-table-column
        prop=""
        width="150"
        label="操作">
        <template slot-scope="scope">
          <el-button type="text" @click="Downbtn(scope)">审核</el-button>
          <el-button type="text" @click="View(scope)">查看详情</el-button>
        </template>
      </el-table-column>
    </el-table>
    <div class="page" v-if="total >= 5">
      <el-pagination
        background
        layout="prev, pager, next"
        @current-change="handleCurrentChange"
        :page-size="pagelimit"
        :total="total">
      </el-pagination>
    </div>
    <el-dialog title="审核" :visible.sync="dialogFormVisible">
      <el-form :model="form">
        <el-form-item label="审批" label-width="120">
          <el-radio v-model="form.state" label="1">通过</el-radio>
          <el-radio v-model="form.state" label="-1">不通过</el-radio>
        </el-form-item>
        <el-form-item v-if="form.state == '-1'" label="不通过原因" label-width="120">
          <el-input v-model="form.reason"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取 消</el-button>
        <el-button type="primary" @click="notDown">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
// import axios from 'axios'
// import qs from 'qs'
export default {
  data () {
    return {
      companyindex: '',
      companyList: [],
      designerindex: '',
      desigList: [],
      contentList: [],
      pagelimit: 5,
      pageindex: 0,
      total: '',
      state: '0',
      title: '',
      dialogFormVisible: false,
      form: {
        state: '1',
        reason: '',
        schemeindex: ''
      }
    }
  },
  methods: {
    getList: function () {
      var that = this
      that.$axios.request('post', '/Company/Index', {
        all: 'true',
        state: 1
      })
        .then((res) => {
          if (res.code === 0) {
            that.companyList = res.data.datalist
          }
        })
      that.$axios.request('post', '/Designer/Index', {
        all: 'true',
        state: 1
      })
        .then((res) => {
          if (res.code === 0) {
            that.desigList = res.data.datalist
          }
        })
    },
    Search: function () {
      var that = this
      that.$pub.open()
      that.$axios.request('post', '/Scheme/Index', {
        state: that.state,
        title: that.title,
        companyindex: that.companyindex,
        designerindex: that.designerindex,
        pagelimit: that.pagelimit,
        pageindex: that.pageindex
      })
        .then((res) => {
          if (res.code === 0) {
            that.contentList = res.data.datalist
            for (var i = 0; i < that.contentList.length; i++) {
              that.contentList[i].thumbnail = that.contentList[i].thumbnail[0].value
            }
            that.total = res.data.total
          }
        })
    },
    Downbtn: function (scope) {
      var that = this
      that.form.schemeindex = scope.row.schemeindex
      that.dialogFormVisible = true
    },
    notDown: function () {
      var that = this
      if (that.form.state === '-1') {
        if (that.form.reason === '') {
          that.$pub.messageTwo('理由不能为空', '提示')
          return false
        }
      }
      that.$axios.request('post', '/Scheme/Examine', {
        schemeindex: that.form.schemeindex,
        state: that.form.state,
        remarks: that.form.reason
      })
        .then((res) => {
          if (res.code === 0) {
            that.dialogFormVisible = false
            that.$axios.messageTwo('操作成功', '提示')
            that.form.state = '1'
            that.form.reason = ''
            that.Search()
          }
        })
    },
    handleCurrentChange (val) {
      var that = this
      that.pageindex = val
      that.Search()
    },
    View: function (scope) {
      var that = this
      var data = JSON.stringify(scope.row)
      that.$router.push({
        name: 'caseDetail',
        params: {
          schemeindex: data
        }
      })
    }
  },
  mounted () {
    this.getList()
    this.Search()
  }
}
</script>
